<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // 数字的显式类型转换
    // 1、Number()
    let numStr = '10'
    console.log(Number(numStr))  // 10
    console.log(typeof Number(numStr))  // number

    // 2、parseInt() 只截取整数部分，遇到非数字字符就停止截取
    console.log(parseInt(numStr))  // 10
    console.log(typeof parseInt(numStr))  // number

    let numStr2 = '50px'
    let numStr3 = '50.34px'
    let numStr4 = '50.86px'
    let numStr5 = 'abc50.86px'
    console.log(parseInt(numStr2))  // 50
    console.log(parseInt(numStr3))  // 50
    console.log(parseInt(numStr4))  // 50
    console.log(parseInt(numStr5))  // NaN

    // 3、parseFloat() 可以截取浮点数部分，遇到非数字字符就停止截取
    console.log(parseFloat(numStr2))  // 50
    console.log(parseFloat(numStr3))  // 50.34
    console.log(parseFloat(numStr4))  // 50.86
    console.log(parseFloat(numStr5))  // NaN

    // 可以使用 +号 隐式类型转换更加方便的转成数字类型
    let num = +prompt('请输入一个数字')
    console.log(num)
    console.log(typeof num)  // number

  </script>
</body>

</html>